<template>
  <el-card class="content-card search-bar">
    <div class="tag-line"></div>
    <el-row type="flex" align="middle">
      <el-col :span="12">
        <div class="title20Class">
          <svg-icon icon-class="query" class="svgClass" />
          搜索
        </div>
      </el-col>
      <el-col :span="12" style="text-align: right">
        <el-button size="small" @click="handleReset">重置</el-button>
        <el-button type="primary" size="small" @click="handleQuery">查询</el-button>
      </el-col>
    </el-row>
    <el-divider content-position="left"></el-divider>
    <slot></slot>
  </el-card>
</template>

<script>
export default {
  methods: {
    handleQuery() {
      this.$emit("on-query")
    },
    handleReset() {
      this.$emit("on-reset")
    },
  }
}
</script>
<style lang="scss">
.search-bar .el-form-item{
    margin: 6px 15px 6px 0;
}
</style>